<template>
  <div class="goods">
    <div>
      <page-search
        :search-form-config="searchFormConfig"
        @resetBtnClick="handleResetClick"
        @queryBtnClick="handleQueryClick"
      />
    </div>

    <div>
      <page-content
        ref="pageContentRef"
        :content-table-config="contentTableConfig"
        page-name="good"
      >
        <template #image="scope">
          <el-image
            style="width: 100%; height: 100%"
            :src="scope.row.imgUrl"
            :preview-src-list="[scope.row.imgUrl]"
          ></el-image>
        </template>
        <template #oldPrice="scope">
          {{ '¥' + scope.row.oldPrice }}
        </template>
        <template #newPrice="scope">
          {{ '¥' + scope.row.newPrice }}
        </template>
      </page-content>
    </div>
  </div>
</template>

<script setup lang="ts">
import { contentTableConfig } from './config/contentTableConfig'
import { searchFormConfig } from './config/searchFormConfig'
import { usePageSearch } from '@/hooks/usePageSearch'

const [pageContentRef, handleResetClick, handleQueryClick] = usePageSearch()
</script>

<style scoped></style>
